import { permission_bind_platform } from '@/services/instiution';
import { ActionType, ProForm, ProFormTextArea } from '@ant-design/pro-components';
import { Divider, message, Modal } from 'antd';
interface Iprops {
  isShowAgreeModal: (show: boolean) => void;
  // 控制外部查看模态框
  isShowPendModal: (show: boolean) => void;
  isAgreeModalOpen: boolean;
  id: number | undefined;
  setSelectedKey: React.Dispatch<React.SetStateAction<string>>;
  actionRef2: React.MutableRefObject<ActionType | undefined>;
  actionRef3: React.MutableRefObject<ActionType | undefined>;
}
type Val = {
  agree_reason?: string;
};
const PendAgree = (props: Iprops) => {
  const {
    isAgreeModalOpen,
    isShowAgreeModal,
    isShowPendModal,
    setSelectedKey,
    id,
    actionRef2,
    actionRef3,
  } = props;
  // 审批同意
  const ConfirmAgree = async (values: Val) => {
    let request_body = {
      id,
      status: 1,
      agree_reason: values.agree_reason,
    };
    let params: any = await permission_bind_platform(request_body);
    // console.log('审批同意', params);
    if (params.msg == 'ok') {
      message.success('审批同意成功！');
      // 审批同意之后跳转到已审批列表
      setSelectedKey('已审批');
      actionRef2.current?.reload();
      actionRef3.current?.reload();
      isShowAgreeModal(false);
      isShowPendModal(false);
    } else {
      message.error(params.msg);
      isShowAgreeModal(false);
    }
  };
  // 点击取消的回调
  const onReset = () => {
    isShowAgreeModal(false);
    isShowPendModal(false);
  };

  return (
    <Modal
      title="同意关联"
      centered
      open={isAgreeModalOpen}
      onCancel={() => isShowAgreeModal(false)}
      destroyOnClose={true}
      width={500}
      footer={null}
    >
      <Divider />
      <ProForm
        onReset={() => onReset()}
        onFinish={async (values) => ConfirmAgree(values)}
        submitter={{
          // 配置按钮文本
          searchConfig: {
            resetText: '取消',
            submitText: '确定',
          },
          resetButtonProps: {
            style: {
              // 隐藏重置按钮
              display: 'block',
              position: 'absolute',
              left: 'calc(50% - 107px)',
            },
          },
          submitButtonProps: {
            style: {
              display: 'block',
              position: 'absolute',
              right: 'calc(50% - 107px)',
            },
          },
        }}
      >
        <ProFormTextArea
          name="agree_reason"
          label="同意原因:"
          placeholder="请填写同意原因!"
          rules={[
            {
              max: 100,
              message: '字数最多100个字符',
            },
          ]}
        />
        <br />
      </ProForm>
      <br />
    </Modal>
  );
};
export default PendAgree;
